<template>
	<section class="all">
	<div class="aside">
		<h4>申请专家基本资料</h4>
		<div>研究领域：{{info.studyArea}}</div>
		<div>申请ID：{{info.applyId}}</div>
		<div>申请人ID：{{info.userId}}</div>
		<div>申请人姓名：{{info.userName}}</div>
		<div>手机号码：{{info.phone}}</div>
		<div>申请时间：{{info.applyTime}}</div>
	</div>
	<div class="main">
		<h4>申请专家其他资料</h4>
		<div class="mainBox">
			<div class="intro">
				<span style="font-size: 20px;font-weight: bold;">自我介绍：</span>
				<span>{{info.intro}}</span>
			</div>
			<div class="collectDesc">
				<span style="font-size: 20px;font-weight: bold;">藏品描述：</span>
				<span>{{info.collectDesc}}</span>
			</div>
		</div>
		<div class="img">
			<h4>收藏图片</h4>
			<div class="collectImgIds">
				<img v-for="todo in info.collectImgIds" :src='todo.url' alt="">
			</div>
		</div>
	</div>
</section>	
</template>	
<script>
	export default{
		data(){
		return {
			info:{}
		}
	},
created(){
	var row=JSON.parse(localStorage.getItem("EAEROW"))
	this.info=row
},
	methods:{

	},
mounted(){

},
}
</script>
<style scoped lang='scss'>
	.all{
		display: flex;
		margin-top: 20px;
	}
	.aside{
		width: 25%;
		height: 100%;
		background: #B3C0D1;
		display: inline-block;
		box-sizing: border-box;
		h4{
			text-align: center;
			margin: 20px 0;
		}
		div{
			margin: 10px 0 0 30px;
		}
	}
	.main{
		box-sizing: border-box;
		display: inline-block;
		width: 75%;
		height: 100%;
		background: #D3DCE6;
		h4{
			text-align: center;
			margin: 20px 0;
		}
		.mainBox{
			display: flex;
			.intro{
				padding-left:10px;
				width: 50%;
				box-sizing:border-box; 
				
			}
			.collectDesc{
				box-sizing:border-box; 
				width: 50%;
				padding: 0 10px;
			}
		}
		.img{
			.collectImgIds{
				padding:10px;
				box-sizing:border-box;
				img{
					width: 50%;
					float: left;
					padding: 5px;
					display: block;
					box-sizing:border-box;
				}
			}
		}
		
	}
</style>